// header组件
import React, { Component } from "react";
import PropTypes from "prop-types";
import "./index.css";
export default class Header extends Component {
  static propTypes = {
    add_todos: PropTypes.func.isRequired,
  };
  // 添加todo
  handle_onchange = (event) => {
    // console.log(event.target.value);
    // console.log(event.keyCode);
    if (event.keyCode !== 13) return;
    if (event.target.value.trim() == "") {
      alert("不准输入空字符串");
      return;
    }
    let value = event.target.value.trim();
    let newObj = { name: value, id: Date.now(), done: false };
    this.props.add_todos(newObj);
  };
  render() {
    let { add_todos } = this.props;
    // console.log("header", add_todos);
    return (
      <div>
        <input
          type="text"
          placeholder="请输入你的爱好"
          onKeyUp={this.handle_onchange}
        />
      </div>
    );
  }
}
